<div class="user-login-container">
    <div class="panel panel-default">
        <div class="panel-heading">
            <h3 class="panel-title">登陆</h3>
        </div>
        <div class="panel-body">
            <form #form='ngForm' (ngSubmit)='doLogin()' autocomplete='off' novalidate class='form-horizontal' role='form'>
                <div class="form-group" [ngClass]="{'has-error': form.dirty && email.invalid}">
                    <label for="email" class="col-md-2 control-label">邮箱：</label>
                    <div class="col-md-10">              
                        <input type="text" name="email" [(ngModel)]="user.userName" class="form-control" required placeholder='请输入邮箱' #email='ngModel'>                     
                        <div class="text-danger" *ngIf="form.dirty && !email.valid">
                            用户名需输入！
                        </div>
                    </div>
                </div>
                <div class="form-group" [ngClass]="{'has-error': password.dirty && !password.valid}">
                    <label for="password" class="col-md-2 control-label">密码：</label>
                    <div class="col-md-10">
                        <input type="text" class='form-control' name="password" minlength='8' [(ngModel)]="user.password" #password='ngModel' required placeholder='请输入密码'>
                        <div *ngIf="password.dirty&&!password.valid" class="text-danger">
                            密码需输入,至少8位！
                        </div>
                    </div>
                </div>
                <div *ngIf="error" class="col-md-offset-2 col-md-10 alert alert-danger">{{error}}</div>
                <div class="form-group">
                    <div class="col-md-offset-2 col-md-10">
                        <button type='submit' [disabled]='!form.valid' class="btn btn-primary btn-margin-1rem">登陆</button>
                        <button type='button' class="btn btn-default" (click)="retrievePwd()">忘记密码？</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
